Tämän kysymyksen vastaukset ovat yhteisön toimia. Muokkaa nykyisiä vastauksia parantaaksesi tätä viestiä. Se ei tällä hetkellä hyväksy uusia vastauksia tai vuorovaikutusta. Kuinka voin ohjata käyttäjän yhdeltä sivulta toiselle käyttämällä jQueryä tai puhdasta JavaScriptiä?
2020-12-07 22:00:41
1
2
Seuraava
JQueryä ei voida yksinkertaisesti ohjata uudelleen
jQuery ei ole välttämätön, ja window.location.replace (...) simuloi parhaiten HTTP-uudelleenohjausta.
window.location.replace (...) on parempi kuin window.location.href, koska Replace () ei säilytä alkuperäistä sivua istuntohistoriassa, mikä tarkoittaa, että käyttäjä ei juutu loputtomaan taaksepäin. painikkeen fiasko.
Jos haluat simuloida linkkiä napsauttavaa käyttäjää, käytä
location.href
Jos haluat simuloida HTTP-uudelleenohjausta, käytä location.replace
Esimerkiksi:
// samanlainen käyttäytyminen kuin HTTP-uudelleenohjaus
window.location.replace ("http://stackoverflow.com");
// samanlainen käyttäytyminen kuin linkin napsauttaminen
window.location.href = "http://stackoverflow.com";
|
VAROITUS: Tämä vastaus on annettu vain mahdollisena ratkaisuna; se ei tietenkään ole paras ratkaisu, koska se vaatii jQueryä. Sen sijaan mieluummin puhdas JavaScript-ratkaisu.
$ (sijainti) .attr ('href', 'http://stackoverflow.com')
|
Tavallinen "vanilja" JavaScript-tapa ohjata sivu uudelleen
window.location.href = 'newPage.html';
Tai yksinkertaisemmin: (koska ikkuna on globaali)
location.href = 'newPage.html';
Jos olet täällä, koska menetät HTTP_REFERER-osoitteen uudelleenohjauksen aikana, jatka lukemista:
(Muussa tapauksessa ohita tämä viimeinen osa)
Seuraava osio on tarkoitettu käyttäjille, jotka käyttävät HTTP_REFERER-ohjelmaa yhtenä monista turvatoimenpiteistä (vaikka se ei ole hyvä suojatoimi). Jos käytät Internet Explorer 8: ta tai vanhempaa, nämä muuttujat menetetään käytettäessä mitä tahansa JavaScript-sivun uudelleenohjausta (location.href jne.).
Seuraavassa aiomme toteuttaa vaihtoehdon IE8: lle ja vanhemmille, jotta emme menetä HTTP_REFERER. Muussa tapauksessa voit melkein aina käyttää yksinkertaisesti window.location.href-tiedostoa.
HTTP_REFERER-testaus (URL-liittäminen, istunto jne.) Voi auttaa selvittämään, onko pyyntö oikeutettu.
(Huomaa: on myös tapoja kiertää / huijata nämä viittaajat, kuten droop-linkki huomauttaa kommenteissa)
Yksinkertainen selainten välinen testausratkaisu (Internet Explorer 9+: n ja kaikkien muiden selainten vaihtoehto Windows.location.href)
Käyttö: redirect ('anotherpage.aspx');
funktion uudelleenohjaus (url) {
var ua = navigator.userAgent.toLowerCase (),
isIE = ua.indexOf ('msie')! == -1,
versio = parseInt (ua.substr (4, 2), 10);
// Internet Explorer 8 tai vanhempi
if (isIE && versio <9) {
var link = document.createElement ('a');
link.href = url;
document.body.appendChild (linkki);
link.click ();
}
// Kaikki muut selaimet voivat käyttää tavallista window.location.href-tiedostoa (ne eivät menetä HTTP_REFERERiä kuten Internet Explorer 8 tai vanhempi)
muu {
ikkuna.sijainti.href = url;
}
}
|
Tähän on monia tapoja.
// ikkuna.sijainti
window.location.replace ('http://www.example.com')
window.location.assign ('http://www.example.com')
window.location.href = 'http://www.esimerkki.com'
document.location.href = '/ polku'
// ikkuna.historia
window.history.back ()
window.history.go (-1)
// ikkuna.navigate; VAIN Internet Explorerin vanhoille versioille
window.navigate ('top.jsp')
// Luultavasti ei buenoa
self.location = 'http://www.esimerkki.com';
top.location = 'http://www.esimerkki.com';
// jQuery
$ (sijainti) .attr ('href', 'http: //www.esimerkki.fi')
$ (ikkuna) .attr ('sijainti', 'http: //www.esimerkki.fi')
$ (sijainti) .prop ('href', 'http://www.esimerkki.fi')
|
Tämä toimii kaikilla selaimilla:
window.location.href = 'sinun_url';
|
Se auttaisi, jos olisit hieman kuvailevampi siinä, mitä yrität tehdä. Jos yrität luoda sivutettua dataa, tässä on joitain vaihtoehtoja. Voit luoda erilliset linkit jokaiselle sivulle, jolle haluat päästä suoraan.
1
2
3
...
Huomaa, että esimerkin nykyistä sivua käsitellään eri tavalla koodissa ja CSS: n kanssa.
Jos haluat, että sivutetut tiedot muutetaan AJAX: n kautta, jQuery tulee tänne. Sinun tulisi lisätä napsautusten käsittelijä kuhunkin eri sivua vastaavaan ankkuritagiin. Tämä napsautuskäsittelijä kutsui jonkin jQuery-koodin, joka menee ja hakee seuraavan sivun AJAX: n kautta ja päivittää taulukon uusilla tiedoilla. Alla olevassa esimerkissä oletetaan, että sinulla on verkkopalvelu, joka palauttaa uudet sivutiedot.
$ (asiakirja) .ready (funktio () {
$ ('a.pager-link'). napsauta (function () {
var sivu = $ (tämä) .attr ('href'). split (/ \? /) [1];
$ .ajax ({
tyyppi: 'POST',
url: '/ polku palveluun',
data: sivu,
menestys: funktio (sisältö) {
$ ('# myTable'). html (sisältö); // korvaa
}
});
return false; // lopettaa linkki
});
});
|
Uskon myös, että location.replace (URL) on paras tapa, mutta jos haluat ilmoittaa hakukoneille uudelleenohjauksestasi (he eivät analysoi JavaScript-koodia nähdäksesi uudelleenohjauksen), sinun on lisättävä rel = "canonical" -meta tag verkkosivustollesi.
Noscript-osion lisääminen HTML-päivityksen metatagiin siinä on myös hyvä ratkaisu. Ehdotan, että käytät tätä JavaScript-uudelleenohjaustyökalua osoitteeseenluoda uudelleenohjauksia. Sillä on myös Internet Explorer -tuki HTTP-viittauksen välittämiseksi.
Viivakoodikoodi näyttää tältä:
: lla
//:/
Protokolla - määrittää protokollan nimen, jota käytetään Internet-resurssin käyttämiseen. (HTTP (ilman SSL: ää) tai HTTPS (SSL: n kanssa))
isäntänimi - Isäntänimi määrittää resurssin omistavan isännän. Esimerkiksi www.stackoverflow.com. Palvelin tarjoaa palveluja isännän nimellä.
portti - porttinumero, jota käytetään tunnistamaan tietty prosessi, jolle Internet tai muu verkkoviesti on lähetettävä, kun se saapuu palvelimelle.
polun nimi - Polku antaa tietoja isännän tietystä resurssista, jota Web-asiakas haluaa käyttää. Esimerkiksi pinoverflow.com/index.html.
kysely - kyselymerkkijono seuraa polkukomponenttia ja tarjoaa tietojonon, jota resurssi voi käyttää johonkin tarkoitukseen (esimerkiksi haun parametreina tai käsiteltävänä datana).
hash - URL-osoitteen ankkuriosa sisältää hash-merkin (#).
Näillä sijaintiobjektiominaisuuksilla pääset kaikkiin näihin URL-komponentteihin
hash - Asettaa tai palauttaa URL-osoitteen ankkuriosan.
isäntä -joukot
tai palauttaa URL-osoitteen isäntänimen ja portin.
isäntänimi - asettaa tai
palauttaa URL-osoitteen isäntänimen.
href - Asettaa tai palauttaa kokonaisuuden
URL.
polun nimi - Asettaa tai palauttaa URL-osoitteen polun nimen.
portti - Asettaa tai palauttaa portin numeron, jota palvelin käyttää URL-osoitteeseen.
protokolla - Asettaa tai palauttaa URL-osoitteen protokollan.
haku -joukot
tai palauttaa URL-osoitteen kyselyosan
Nyt Jos haluat muuttaa sivua tai ohjata käyttäjän jollekin muulle sivulle, voit käyttää Sijainti-objektin href-ominaisuutta näin
Voit käyttää Sijainti-objektin href-ominaisuutta.
window.location.href = "http://www.stackoverflow.com";
Location Objectilla on myös nämä kolme tapaa
osoita () - Lataa uuden asiakirjan.
reload () - Lataa nykyisen asiakirjan uudelleen.
korvaa () - Korvaa nykyisen asiakirjan uudella
Voit käyttää assign () - ja korvausmenetelmiä myös uudelleenohjaamiseksi muille tällaisille sivuille
location.assign ("http://www.stackoverflow.com");
location.replace ("http://www.stackoverflow.com");
Millä määritys () ja korvaa () eroavat - Vaihto () -metodin ja määritä () -menetelmän () välillä on, että korvaus () poistaa nykyisen asiakirjan URL-osoitteen asiakirjahistoriasta, mikä tarkoittaa, että sitä ei voida käyttää "Takaisin" -painiketta siirtyäksesi takaisin alkuperäiseen asiakirjaan. Joten käytä assign () -menetelmää, jos haluat ladata uuden asiakirjan, ja haluatko antaa vaihtoehdon palata takaisin alkuperäiseen asiakirjaan.
Voit muuttaa sijaintiobjektin href-ominaisuutta myös tämänkaltaisen jQueryn avulla
$ (sijainti) .attr ('href', url);
Ja siten voit ohjata käyttäjän johonkin muuhun URL-osoitteeseen.
|
Periaatteessa jQuery on vain JavaScript-kehys, ja jos haluat tehdä joitain asioita, kuten uudelleenohjaus tässä tapauksessa, voit käyttää vain puhdasta JavaScriptiä, joten siinä tapauksessa sinulla on 3 vaihtoehtoa vaniljan avullaJavaScript:
1) Sijainnin korvaaminen -toiminnon avulla tämä korvaa sivun nykyisen historian, mikä tarkoittaa, että Takaisin-painikkeella ei ole mahdollista palata alkuperäiselle sivulle.
window.location.replace ("http://stackoverflow.com");
2) Käyttämällä sijainninmääritystä tämä pitää historian puolestasi ja voit palata takaisin alkuperäiselle sivulle käyttämällä Takaisin-painiketta:
window.location.assign ("http://stackoverflow.com");
3) Suosittelen käyttämään yhtä näistä edellisistä tavoista, mutta tämä voi olla kolmas vaihtoehto puhtaalla JavaScriptilla:
window.location.href = "http://stackoverflow.com";
Voit myös kirjoittaa funktion jQueryyn käsittelemään sitä, mutta ei suositeltavaa, koska se on vain yhden rivin puhdas JavaScriptiä-toiminto. Voit myös käyttää kaikkia yllä olevia toimintoja ilman ikkunaa, jos olet jo ikkunan laajuudessa, esimerkiksi window.location.replace ("http://stackoverflow.com"); voi olla location.replace ("http://stackoverflow.com");
Näytän myös ne kaikki alla olevassa kuvassa:
|
Pitäisi vain pystyä määrittämään käyttämällä window.location.
Esimerkki:
window.location = "https://stackoverflow.com/";
Tässä on aikaisempi viesti aiheesta: Kuinka ohjaan toiselle verkkosivulle?
|
Ennen kuin aloitan, jQuery on JavaScript-kirjasto, jota käytetään DOM-manipulointiin. Joten sinun ei pitäisi käyttää jQueryä sivun uudelleenohjaukseen.
Lainaus Jquery.com-sivustolta:
Vaikka jQuery saattaa toimia ilman suurempia ongelmia vanhemmissa selainversioissa,
emme testaa jQueryä aktiivisesti niissä emmekä yleensä korjaa vikoja
jotka voivat näkyä niissä.
Se löytyi täältä:
https://jquery.com/browser-support/
Joten jQuery ei ole loppujen ja kaikkien ratkaisu taaksepäin yhteensopivuuteen.
Seuraava ratkaisu, joka käyttää raakaa JavaScriptiä, toimii kaikissa selaimissa ja on ollut vakiona pitkään, joten sinun ei tarvitse kirjastoja selainten väliseen tukeen.
Tämä sivu ohjaa Googlelle 3000 millisekunnin kuluttua
esimerkki
Sinut ohjataan pian Googleen.
Eri vaihtoehdot ovat seuraavat:
window.location.href = "url"; // Simuloi normaalia siirtymistä uudelle sivulle
window.location.replace ("url"); // Poistaa nykyisen URL-osoitteen historiasta ja korvaa sen uudella URL-osoitteella
window.location.assign ("url"); // Lisää uuden URL-osoitteen historian pinoon ja ohjaa uuteen URL-osoitteeseen
ikkuna.historia.back (); // Simuloi paluupainikkeen napsautusta
ikkuna.historia.go (-1); // Simuloi paluupainikkeen napsautusta
ikkuna.historia.takaisin (-1); // Simuloi paluupainikkeen napsautusta
window.navigate ("page.html"); // Sama kuin window.location = "url"
Korvausta käytettäessä Takaisin-painike ei palaa uudelleenohjaussivulle, ikään kuin sitä ei olisi koskaan ollut historiassa. Jos haluat käyttäjän voivan palata uudelleenohjaussivulle, käytä window.location.href- tai window.location.assign -toimintoa. Jos käytät vaihtoehtoa, jonka avulla käyttäjä voi palata uudelleenohjaussivulle, muista, että kun syötät uudelleenohjaussivun, se ohjaa sinut takaisin. Joten ota se huomioon, kun valitset vaihtoehdon uudelleenohjaukselle. Olosuhteissa, joissa sivu ohjataan uudelleen vain, kun käyttäjä suorittaa toiminnon, sivun pitäminen Takaisin-painikkeen historiassa on kunnossa. Mutta jos sivu ohjaa automaattisesti, sinun on käytettävä korvaamista, jotta käyttäjä voi käyttää takaisin-painiketta ilman, että hänet pakotetaan palaamaan uudelleenohjauksen lähettämälle sivulle.
Voit käyttää metatietoja myös sivun uudelleenohjauksen suorittamiseen seuraavasti.
META-päivitys
META Sijainti
BASE kaappaus
Poistu
Poistu
Jos yhdistät kaksi sivuesimerkkiä yhteen, sinulla on lapsisilmukka ohjata se uudelleentakaa, että käyttäjäsi ei koskaan halua käyttää sivustoasi koskaan uudelleen.
|
var url = 'asdf.html';
ikkuna.sijainti.href = url;
|
Voit tehdä sen ilman jQueryä seuraavasti:
window.location = "http://omaverkkotunnus.com";
Ja jos haluat vain jQueryn, voit tehdä sen kuten:
$ jq (ikkuna) .attr ("sijainti", "http://omaverkkotunnus.com");
|
Tämä toimii jQueryn kanssa:
$ (ikkuna) .attr ("sijainti", "http://google.fr");
|
# HTML-sivun uudelleenohjaus jQuery / JavaScript-menetelmällä
Kokeile tätä esimerkkikoodia:
toiminto YourJavaScriptFunction ()
{
var i = $ ('# login'). val ();
if (i == 'sisäänkirjautuminen')
window.location = "Kirjaudu.php";
muu
window.location = "Kirjaudu ulos.php";
}
Jos haluat antaa täydellisen URL-osoitteen window.location = "www.google.co.in" ;.
|
Alkuperäinen kysymys: "Kuinka ohjata uudelleen jQueryn avulla?", Siksi vastaus toteuttaa jQuery >> Ilmainen käyttötapa.
Vain uudelleenohjaaminen sivulle, jolla on JavaScript:
window.location.href = "/ contact /";
Tai jos tarvitset viivettä:
setTimeout (function () {
window.location.href = "/ contact /";
}, 2000); // Aika millisekunteina
jQueryn avulla voit valita elementtejä verkkosivulta helposti. Löydät haluamasi sivulta ja lisää sitten jQuery-sovelluksella erikoistehosteita, reagoi käyttäjän toimiin tai näytä ja piilota sisältöä valitsemasi elementin sisällä tai ulkopuolella. Kaikki nämä tehtävät alkavat tietämällä, kuinka elementti tai tapahtuma valitaan.
$ ('a, img'). on ('napsauta', funktio (e) {
e.preventDefault ();
$ (tämä) .animaatti ({
opasiteetti: 0 // Laita CSS-animaatio tähän
}, 500);
setTimeout (function () {
// OK, valmis jQuery-henkilökunta, siirretään uudelleen
window.location.href = "/ contact /";
}, 500);
});
Kuvittele, että joku kirjoitti käsikirjoituksen / laajennuksen 10000 rivillä koodia. JQueryn avulla voit muodostaa yhteyden tähän koodiin vain rivillä tai kahdella.
|
Sinun on lisättävä tämä rivi koodiin:
$ (sijainti) .attr ("href", "http://stackoverflow.com");
Jos sinulla ei ole jQueryä, siirry JavaScriptiin:
window.location.replace ("http://stackoverflow.com");
window.location.href ("http://stackoverflow.com");
|
Joten kysymys on siitä, miten tehdä uudelleenohjaussivu, eikä miten uudelleenohjata verkkosivustolle?
Sinun tarvitsee käyttää vain JavaScriptiä tähän. Tässä on pieni koodi, joka luo dynaamisen uudelleenohjaussivun.
Joten sano, että laitat tämän koodinpätkän uudelleenohjaus / index.html-tiedostoon verkkosivustollasi.
http://www.mywebsite.com/redirect?url=http://stackoverflow.com
Ja jos siirryt siihen linkkiin, se ohjaa sinut automaattisesti stackoverflow.com-sivustoon.
Linkki dokumentaatioon
Ja näin teet yksinkertaisen uudelleenohjaussivun JavaScriptillä
Muokata:
On myös yksi asia, joka on huomattava. Olen lisännyt window.location.replace koodiini, koska mielestäni se sopii uudelleenohjaussivulle, mutta sinun on tiedettävä, että kun käytät window.location.replace -ohjelmaa ja sinut ohjataan uudelleen, kun painat selaimen Takaisin-painiketta, palasin uudelleenohjaussivulle, ja se palaa edelliselle sivulle, katsokaa tätä pientä demo-asiaa.
Esimerkki:
Prosessi: tallenna home => ohjaa sivu google => google
Kun olet google: google => takaisin-painike selaimessa => tallentaa kotiin
Joten, jos tämä sopii tarpeisiisi, kaiken pitäisi olla kunnossa. Jos haluat sisällyttää uudelleenohjaussivun selaimen historiaan, korvaa tämä
if (url) ikkuna.sijainti.korvaa (url);
kanssa
if (url) ikkuna.sijainti.href = url;
|
Lisää napsautustoimintoon vain:
window.location.href = "URL, johon haluat ohjata";
$ ('# id'). napsauta (function () {
window.location.href = "http://www.google.com";
});
|
Kokeile tätä:
location.assign ("http://www.google.com");
Koodinpätkä esimerkistä.
|
jQueryä ei tarvita. Sinä pystyt tähän:
window.open ("URL", "_ self", "", "")
Se on niin helppoa!
Paras tapa käynnistää HTTP-pyyntö on asiakirja.loacation.href.replace ('URL').
|
Kirjoita ensin oikein. Haluat siirtyä sovelluksessa toiseen linkkiin sovelluksestasi saadaksesi toisen linkin. Tässä on koodi:
window.location.href = "http://www.google.com";
Ja jos haluat navigoida sivuilla sovelluksessasi, minulla on myös koodi, jos haluat.
|
Voit ohjata jQueryssä näin:
$ (sijainti) .attr ('href', 'http://omaSivusi.com/');
|
JavaScriptin käyttö:
Menetelmä 1:
window.location.href = "http://google.com";
Menetelmä 2:
window.location.replace ("http://google.com");
JQueryn käyttäminen:
Tapa 1: $ (sijainti)
$ (sijainti) .attr ('href', 'http://google.com');
Tapa 2: Uudelleenkäytettävä toiminto
jQuery.fn.redirectTo = funktio (url) {
ikkuna.sijainti.href = url;
}
jQuery (ikkuna) .redirectTo ("http://google.com");
|
JavaScriptissä ja jQueryssä voimme käyttää seuraavaa koodia uudelleenohjataaksesi yhden sivun toiselle sivulle:
window.location.href = "http://google.com";
window.location.replace ("page1.html");
|
ECMAScript 6 + jQuery, 85 tavua
$ ({jQueryCode: (url) => location.replace (url)}). attr ("jQueryCode") ("http://example.com")
Älä tapaminä, tämä on vitsi. Se on vitsi. Tämä on vitsi.
Tämä "antoi vastauksen kysymykseen" siinä mielessä, että se pyysi ratkaisua "käyttämällä jQueryä", joka tässä tapauksessa edellyttää sen pakottamista yhtälöön jollain tavalla.
Ferrybig tarvitsee ilmeisesti vitsi selitettynä (vitsaillen edelleen, olen varma, että arvostelulomakkeella on rajoitettuja vaihtoehtoja), joten ilman jatkojalostusta:
Muut vastaukset käyttävät jQueryn attr (): ta sijaintiin tai ikkunaobjekteihin turhaan.
Tämä vastaus käyttää sitä väärin, mutta naurettavammalla tavalla. Sen sijaan, että sitä käytettäisiin sijainnin asettamiseen, se käyttää attr () -toimintoa hakemaan toiminnon, joka asettaa sijainnin.
Funktion nimi on jQueryCode, vaikka siinä ei ole mitään jQueryä, ja funktion kutsuminen somethingCode on vain kamala, varsinkin kun jotain ei ole edes kieli.
"85 tavua" viittaa Code Golfiin. Golfia ei tietenkään pidä tehdä koodigolfin ulkopuolella, ja lisäksi tätä vastausta ei selvästikään ole golfattu.
Pohjimmiltaan rypistää.
|
Javascript:
window.location.href = 'www.omasi_url.com';
window.top.location.href = 'www.omasi_url.com';
window.location.replace ('www.your_url.com');
Jquery:
var url = 'www.oma_url.com';
$ (sijainti) .attr ('href', url);
$ (sijainti) .prop ('href', url); // sijainnin sijasta voit käyttää ikkunaa
|
Tässä on aikaviiveen uudelleenohjaus. Voit asettaa viiveaikaksi haluamasi:
Asiakirjan otsikko
Sinut ohjataan 8 sekunnissa!
|
Tähän on kolme päätapaa,
window.location.href = 'blaah.com';
window.location.assign ('blaah.com');
ja...
window.location.replace ('blaah.com');
Viimeinen on paras perinteiselle uudelleenohjaukselle, koska se ei tallenna sivua, jolla kävit ennen uudelleenohjaamista hakuhistoriaasi. Jos kuitenkin haluat vain avata välilehden JavaScriptillä, voit käyttää mitä tahansa yllä olevista
MUOKKAA: Ikkunan etuliite on valinnainen.
|
1
2
Seuraava
Eikö vastausta etsit? Selaa muita kysymyksiä, jotka on merkitty koodilla javascript jquery redirect tai esitä oma kysymyksesi.